<template>
	<view class="all_body">
		<view class="bady_note_item" v-for="item in babynoteData " :key="item.imgsrc" >
			<view class="bady_header_img">
				<image src="../../static/image/foot.jpeg" ></image>
<!-- 			<image  v-if="picSrc" :src="picSrc+item.imgsrc" mode=""></image> -->
<!-- 			{{picSrc+item.imgsrc}} -->
				
			</view>
			
			<view class="bady_container">
				<view class="bady_title active">{{item.title}}</view>
				<view class="bady_title_item">
					<text >By</text>
					<text class="active">aa</text>
				</view>
			</view>
			
			<view class="baby_container_text">
				<view class="baby_container_text_title">{{englishTitle[item.Classification]}}</view>
				<view class="baby_container_text_text">{{item.text}}</view>
			</view>
			
			<view class="baby_fashion_footer">
				<view class="note_date">天气:  {{item.weather}}</view>
				<view class="note_date">日期:  {{item.date}}</view>
			</view>
		</view>

		
			
		
		
	</view>
</template>

<script>

	export default{
		data(){
			return {
				babyInfo:[],
				username:'',
				babynoteData:[],
				 titleArray:["美食","汽车","时尚","旅行","科技"],
				 englishTitle:["food","car","fashion","trip","technoical"],
				 picSrc:'../../upimage/',
				 Classification:0,
				 weather:{}
		
			}
		},
		methods:{
			
			request(){
			let that = this
			let babyInfo = uni.getStorageSync("user")
		console.log(babyInfo)
		console.log(this.babynoteData)
			if(that.babynoteData.length==0){
				let username = babyInfo[0].us
					
					let parmas = {
						username:username,
						Classification:this.Classification
					}
					console.log(parmas)
					uni.request({
						url:"http://localhost:4008/bady/showUserday",
						method:"POST",
						data:parmas,
						success(res){
							console.log(res)
							that.babynoteData = res.data.data
							
						}
					})
			}
			},
			
		
		},
		computed:{
     //       showTime(date){
			  // return function(){
				 //  let dateNow1 = new Date(date)
				 //  let dateNow = dateNow1.toLocaleDateString().replace(/\//g, "-") + " " + dateNow1.toTimeString().substr(0, 8)
				 //  return dateNow
			  // }
		   // }

		},
		onLoad(option) {
			let that = this
		
			this.Classification = parseInt(option.data)
			let data = uni.getStorageSync("findData")
			this.babynoteData = data
			
			this.request()
			
		},
		onReady() {
		
		},
		destroyed() {
			console.log(111111111)
			uni.removeStorageSync("findData")
		}
	}
</script>

<style lang="less">
	.bady_header_img{
		width: 100%;
		height: 400rpx;
		// background: #ccc;
		image{
			width: 100%;
			height: 350rpx;
		}
	}
	.bady_container{
		width: 100%;
		height:100rpx;
		// background: #ccc;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 20rpx;
		box-sizing: border-box;
		// text-align: center;
		 font-family: "楷体"; 
		 color:#ccc;
		 font-style: italic;
		.bady_title_item{
			width: 200rpx;
			display: flex;
			justify-content: space-around;
			
		  text{width: 100%;	text-align: center;box-sizing: border-box;padding-right: 20rpx;
		    
		  }
		}
	}
	.baby_container_text{
		width: 90%;
		height: 300rpx;
		margin: auto;
		.baby_container_text_title{
			font-size: 65rpx;
			font-weight: bold;
			margin-bottom: 50rpx;
			
		}
		.baby_container_text_text{
			font-weight: 200;
			font-size: 30rpx;
		}
	}
	
	.bady_note_item{
		// height: 600rpx;
		margin-bottom: 50rpx;
		border-bottom: 1rpx solid #ccc;
		animation: beautiful 0.5s ;
	}
	// .note_date{
	
	// }
	
	.baby_fashion_footer{
		display: flex;
		justify-content: space-between;
		    color: #ccc;
			font-size: 30rpx;
			// font-family: "楷体";
			font-style: italic;
			text-align: right;
			margin: 20rpx;
	}
	.bady_note_item:nth-child(1){
		animation: beautiful 0.5s ;
	}
	.bady_note_item:nth-child(2){
		animation: beautiful 1s ;
	}
	.bady_note_item:nth-child(3){
		animation: beautiful 1.5s ;
	}
	.bady_note_item:nth-child(4){
		animation: beautiful 2s ;
	}
	
	
	@keyframes beautiful {
		0%{
			transform: translateX(100vw);
		}
		100%{
			transform: translateX(0);
		}
		
		
		
	}
	
	.active{
		border-bottom: 2rpx solid red;
	}
</style>
